<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <!--以下代码告诉IE浏览器，IE8/9及以后的版本都会以最高版本IE来渲染页面-->
    <meta http-equiv="x-ua-compatible" content="IE=edge">
    <!--
    viewport标记，用于指定用户是否可以缩放Web页面，并对相关的选项进行设定。
    width 和height 指令分别指定视区的逻辑宽度和高度。它们的值可以是以像素为单位的数字，也可以是一个特殊的标记符号。如上文代码中device-width即表示，视区宽度应为设备的屏幕宽度。类似的，device-height即表示设备的屏幕高度。
    initial-scale用于设置Web页面的初始缩放比例。默认的初始缩放比例值因智能手机浏览器的不同而有所差异，通常情况下，设备会在浏览器中呈现出整个Web页面。设为1.0则显示未经缩放的Web页面
    -->
    <meta name="viewport" content="width=device-width,initial-scale=1.0">
    <!-- 上述3个meta标签*必须*放在最前面，任何其他内容都*必须*跟随其后！确保支持响应式布局 -->
    <title>7.1基于html文档</title>
</head>
<body>
</body>
</html>